body{
	 margin: 0;
	-webkit-user-select:none;
	-webkit-touch-callout: none; 
	-webkit-text-size-adjust: 100%;
	font-family: helvetica;
}
a,input,button{
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}
button,input{
	-webkit-appearance: none;
	border-radius: 0;
}
:root{
	--c1:#dd1a21;
}
body{
	font-size: 12px;
	background-color: #eee;
	color: #333;
}
a{
	text-decoration: none;
	color: #333333;
}
input{
	outline: none;
	vertical-align: middle;
	padding: 0;
}
ul{
	list-style: none;
	margin: 0;
	padding: 0;
}
img{
	vertical-align: middle;
}
h1,h2,h3,h4,p{
	  margin: 0;
}
html{
	font-size: 13.333333333334vw;
}
#logo{
	display:inline-block;
	background: url(https://yanxuan-static.nosdn.127.net/hxm/yanxuan-node-wap/style/img/index-20a8c6c35d0ec7b54782d2098282371f.png);
	width:1.8rem;
	height: 0.5rem;
	background-size: 5.013333333333334rem 5.013333333333334rem;;
    background-position: -1.68rem -3.36rem;
}
/* 头部 */
.header{
	width: 100vw;
	background-color: #fff;
    position: fixed;
    left: 0;
	top: 0;
	z-index: 2;
}
.head{
	height: 0.96rem;
	padding: 0.3rem;
	display: flex;
	justify-content: space-between;
	align-items: center;
	
} 
.head .search{
	height: .56rem;
    line-height: .56rem;
    background-color: #ededed;
	border-radius: .08rem;
	font-size: .28rem;
    color: #666;
	text-align: center;
	margin: 0.2rem;
	flex: 1 1 auto;/* 扩展 收缩 宽度 */
}
.head .logoin button{
	font-size: .24rem;
	color: var(--c1);
	border: 1px solid var(--c1);
	border-radius: .08rem;
}
.channel{
	height: .6rem;
	position: relative;
}
.channel .title{
	display: none;
}
.channel .scrollWrap{
	width: 5.9rem;
	box-sizing: border-box;
	padding-left: .3rem;
}
.channel .inner{
	font-size: .28rem;
	line-height: .56rem;
    white-space: nowrap;/* 不换行 */
	float: left;
}
.channel .inner a{
	display: inline-block;
	padding: 0 .16rem;
	margin-left: .2rem;
}
.channel .inner a.active{
	color: var(--c1);
	margin-left: 0;
	border-bottom: .04rem solid var(--c1);
}
.channel .more{
	width: 1.6rem;
	position: absolute;
	right: 0;
	top: 0;
	display: flex;
}
.channel .more div{
	width: 1rem;
	background: #FFFFFF;
	text-align: center;
	height: .6rem;
}
.channel .more::before{
	content:"";
	width: .6rem;
	height: .6rem;
	background-image: linear-gradient(90deg,rgba(255,255,255,0),#fff);
}
.blockChannel{
	
}
.blockChannel .title{
	display: block;
	height: .6rem;
	font-size: .28rem;
	line-height: .6rem;
	padding-left: .3rem;
}
.blockChannel .scrollWrap{
	width: 100vw;
	padding: .24rem .3rem 0;
	background-color: #FFFFFF;
}
.blockChannel .inner{
	white-space: normal;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.blockChannel .inner a{
	width: 1.5rem;
	height: .56rem;
	font-size: .24rem;
	color: #333;
	padding: 0;
	text-align: center;
	margin:0 0 .4rem 0 ;
	border: 1px solid #ccc;
	border-radius: .04rem;
}
.blockChannel .inner a.active{
	border: 1px solid var(--c1);
	color:var(--c1);
}
/* 引入图标库 */
@font-face {
  font-family: 'iconfont';
  src: url('../font/font_9d10ptd61p/iconfont.eot');
  src: url('../font/font_9d10ptd61p/iconfont.eot?#iefix') format('embedded-opentype'),
      url('../font/font_9d10ptd61p/iconfont.woff2') format('woff2'),
      url('../font/font_9d10ptd61p/iconfont.woff') format('woff'),
      url('../font/font_9d10ptd61p/iconfont.ttf') format('truetype'),
      url('../font/font_9d10ptd61p/iconfont.svg#iconfont') format('svg');
}
.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.search span.iconfont{
	font-size: .28rem;
	margin-right: .05rem;
}
.more span.iconfont{
	font-size: .56rem;
	color: #b2b2b2;
	transition: .3s;
	display: inline-block;
}
.blockChannel .more span.iconfont{
	transform: rotate(180deg);
}
/* banner */
.banner{
	width: 100vw;
	margin-top: 2.3rem;
	overflow: hidden;
	position:relative ;
}
.banner .wrap{
	width: 800vw;
	display: flex;
}
.banner .wrap a{
	width: 100vw;
}
.banner .wrap a img{
	width: 100%;
}
.banner .circle{
	position: absolute;
    bottom: 0.15rem;
	width: 100vw;
	display: flex;
	justify-content: center;
}
.banner .circle span{
	width: 0.4rem;
	height: .04rem;
	margin: 0 0.1rem;
	background: rgba(255,255,255,0.5);
}
.banner .circle span.active{
	background: rgba(255,255,255,1);
}
/*导航*/
.nav{
	background-color: #FFFFFF;
}
.nav .service{
	display: flex;
	height: .72rem;
	justify-content: space-around;
	align-items: center;
}
.nav service span{
	vertical-align: middle;
}
.nav .service span:nth-child(1){
	color: #cc6d70;
	font-size: .3rem;
	margin-right: .1rem;
}
.nav .service span:nth-child(2){
	font-size: .24rem;
}
.nav .navList{
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
}
.nav .navList li{
	margin: .1rem .18rem;
}
.nav .navList li a{
	display: flex;
	flex-direction: column;
	text-align: center;
}
.nav .navList li img{
	width: 1.1rem;
	margin-bottom: .1rem;
}
.nav .navList li span{
	font-size: .24rem;
}
/* 广告 */
.ad{
	display: flex;
	justify-content: space-between;
	margin: .2rem;
}
.ad img{
	width: 3.5rem;
}
/* 新人专享礼包 */
.newPeople{
	background: #fff;
	margin: .2rem 0;
}
.newPeople h3{
	height: .9rem;
	font-size: .32rem;
	text-align: center;
	line-height: .9rem;
	font-weight: normal;
}
.newPeople h3 span{
	position: relative;
}
.newPeople h3 span::before,newPeople h3 span:after{
	content: "";
	width: .24rem;
	height: .04rem;
	position: absolute;
	top: 50%;
	margin-top: -0.2rem;
	background: #333;
}
 .newPeople h3 span:before{
	 left: -0.4rem;
 }
 .newPeople h3 span:after{
	 right: -0.4rem;
 }
 .newPeople .content{
	 display: flex;
	 justify-content: space-between;
     padding: 0 .3rem .3rem .3rem;
 }
 .newPeople .contentLeft{
	 width: 3.43rem;
	 height: 4.34rem;
	 background: #F9E9CF;
	 border-radius: .04rem;
 }
 .newPeople .contentLeft h4{
	     font-size: .32rem;
		 font-weight: normal;
		 padding: .3rem 0 .37rem .3rem;
 }
 .newPeople .contentLeft .img{
	     width: 2.58rem;
		 height: 2.57rem;
		 margin: 0px auto;
		 background: url(https://yanxuan.nosdn.127.net/352b0ea9b2d058094956efde167ef852.png) no-repeat center/100% 100%;   
 }
 .newPeople .contentRight{
	 display: flex;
	 flex-direction: column;
	 justify-content: space-between;
}
.newPeople .contentRight a{
	width: 3.43rem;
	height: 2.15rem;
	border-radius: .04rem;
	box-sizing: border-box;
	padding: .2rem;
}
.newPeople .contentRight a h4{
	font-size: .32rem;
	font-weight: normal;
}
.newPeople .contentRight a:nth-child(1){
	background:#fbe2d3 url(https://yanxuan-item.nosdn.127.net/2c0147161faaa160cf10b6770f1e290d.png?quality=75&type=webp&imageView&thumbnail=200x200) no-repeat right bottom/2rem 2rem ;
	position: relative;
}
.newPeople .contentRight a:nth-child(1) p{
		color: #F7F7F7;
		font-size: .24rem;
}
.newPeople .contentRight a:nth-child(1) .discount{
	width: .8rem;
	height: .8rem;
	position: absolute;
	top: .2rem;
	right: .2rem;
	background: #f59524;
	border-radius: 50%;
	padding-top: .1rem;
	color: #fff;
	text-align: center;
	font-size: .24rem;
}
.newPeople .contentRight .discount div:last-child{
	text-decoration: line-through;
}
.newPeople .contentRight a:nth-child(2){
	background: #ffecc2 url(https://yanxuan-item.nosdn.127.net/fc02a38d31bb0c0a19cfa64b91a3ca2f.png?quality=75&type=webp&imageView&thumbnail=200x200) no-repeat 1.4rem bottom/2rem 2rem ;
	position: relative;
}
.newPeople .contentRight a:nth-child(2) p{
	font-size: .22rem;
	color: #fff;
	text-align: center;
	line-height: .3rem;
	display: inline-block;
	background: #cbb693;
	border-radius: .04rem;
}
.newPeople .contentRight a:nth-child(2) .discount1{
	width: 1rem;
	height: 0.8rem;
	position: absolute;
	top: .2rem;
	right: .2rem;
	background: #f59524;
	border-radius: 50%;
	padding-top: .1rem;
	color: #fff;
	text-align: center;
	font-size: .24rem;
}
.newPeople .contentRight .discount1 div:last-child{
	text-decoration: line-through;
}


/* 类目热销榜 */
.hot{
	margin: .2rem 0;
	background-color: #fff;
	padding: 0 .3rem .3rem .3rem;
}
.hot h3{
	font-size: .32rem;
	line-height: 1rem;
	font-weight: normal;
}
.hot .hotContent1{
	display: flex;
	justify-content: space-between;
}
.hot .hotContent1 a{
	width: 3.4rem;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.hot .hotContent1 a:nth-child(1){
	background: #f9f3e4;
}
 .hot .hotContent1 a img{
	 width: 2rem;
	 height: 2rem;
 }
 .hot .hotContent1 a span{
	 font-size: .32rem;
	 margin-left:.32rem ;
	 position: relative;
 }
 .hot .hotContent1 a span::before{
   content: "";
   width: .48rem;
   height: .04rem;
   position: absolute;
   left: 0;
   bottom: -.14rem;
   background-color: #333;
 }
  .hot .hotContent1  a:nth-child(2){
	  background-color: #ebeff6;
  }
  .hot .hotContent2{
	  display: flex;
	  justify-content: space-between;
      flex-wrap: wrap;	  
  }
.hot .hotContent2 li{
	background: #f5f5f5;
	border-radius: .04rem;
	margin-top: .1rem;
}
.hot .hotContent2 li a{
	display: block;
	width: 1.65rem;
	height: 1.8rem;
	text-align: center;
	padding-top: .1rem;
	box-sizing: border-box;
}
.hot .hotContent2 li a img{
	width: 1.2rem;
	height: 1.2rem;
}
.hot .hotContent2 li a span{
	font-size: .25rem;
}
/* 限时购 */
.limit{
	background: #fff;
	padding: 0 .3rem;
}
.limit .title,.newProductor .title{
	display: flex;
	align-items: center;
	height: 1rem;
}
.limit .title h3{
	font-size: .32rem;
	font-weight: normal;
}
.limit .title .time{
	font-size: .28rem;
	font-weight:bold ;
	margin-right: auto;
}
.limit .title .time span{
	font-size: .24rem;
	color: #fff;
	font-weight: normal;
	text-align: center;
	display: inline-block;
	width: .36rem;
	height: .36rem;
	background: #333;
	line-height: .36rem;
	border-radius: .04rem;
	margin: 0 .1rem;
}
.limit .title .more span,.newProductor .title .more span{
	vertical-align: middle;
	font-size: .28rem;
}
.limit .title .more span .iconfont,.newProductor .title .more span .iconfont{
	 font-size: .40rem;
	 font-weight: bold;
	 color: #bbb;
}
.limit .list,.newProductor ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.limit .list a,.newProductor ul a{
	display: block;
	width: 2.16rem;
	height: 3rem;
}
.limit .list a img,.newProductor ul a img{
	width: 2.16rem;
	height: 2.16rem;
	background: #f5f5f5;
	border-bottom: #f5f5f5;
	border-radius: .04rem;
	margin-bottom: .1rem;
}
.limit .list a p{
	font-size: .28rem;
	color: var(--c1);
	padding-left: .2rem;
}
.limit .list a p span:last-child{
	font-size: .24rem;
	color:#7f7f7f;
	text-decoration: line-through;
	margin-left: .2rem;
}
/* 新品首发 */
.newProductor{
	background: #fff;
	margin: .2rem 0;
	padding: 0 .3rem .17rem;
}
.newProductor .title {
	justify-content: space-between;
}
.newProductor ul li{
	margin-bottom: .13rem;
}
.newProductor ul li a{
	height: auto;
}
.newProductor ul li p{
	font-size: .24rem;
	line-height: .36rem;
	/* 出现省略号的固定写法 */
	display: -webkit-box;
    -webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.newProductor ul li span{
	display: block;
	font-size: .32rem;
	line-height: .48rem;
	color:var(--c1);
}
.newProductor ul li button{
	height: .3rem;
	line-height: .3rem;
	padding: 0 .08rem;
	font-size: .18rem;
	color: var(--c1);
	background: rgba(255,255,255,.9);
	border: 1px solid var(--c1);
	border-radius: .15rem;
	margin-left: .1rem;
}


/* 购物指导 */

	.guide{
		display: flex;
		justify-content: space-between;
	    background-color: #fff;
		padding: .3rem .3rem .1rem .3rem;
	}
	.guide li{
		background-color: #F5F5F5;
		margin-bottom: .2rem;
	}
	.guide li a{
		display: block;
		padding: .15rem;
	}
	.guide li h3{
		font-size: .32rem;
		font-weight: normal;
	}
	.guide li h4{
		color: #7F7F7F;
		font-size: .24rem;
		font-weight: normal;
	}
	.guide li img{
		width: 1.5rem;
		height: 1.5rem;
	}
	/* 底部 */
	.foot{
		background: #414141;
		margin: .2rem 0 .28rem 0;
		padding: .54rem 0 .30rem 0;
		text-align: center;
		position: relative;
		height: 2.3rem;
	}
	.foot .btn{
		margin-bottom: .36rem;
	}
	.foot .btn a{
		display: inline-block;
		width: 1.72rem;
		height: .62rem;
		line-height: .62rem;
		border: 1px solid #999;
		color: #fff;
		font-size: .24rem;
		border-radius:.04rem;
		margin:  0 .2rem;
	}
	.foot p{
		font-size: .24rem;
		line-height: .32rem;
		color: #999;
		
	}
	/* 底部导航 */
	.footernav{
		width: 100vw;
		height: 1rem;
		box-sizing: border-box;
		background: #fff;
		border: 1px solid #d9d9d9;
		position: fixed;
		bottom: 0;
		display: flex;
		justify-content: space-around;
		align-items: center;
	}
	.footernav a{
		text-align: center;
	}
	.footernav a span{
		display: block;
		font-size: .24rem;
	}
	.footernav a span.iconfont{
		font-size: .36rem;
	} 
	.footernav a.active{
		color: var(--c1);
	}
	/* 回到顶部 */
	.backTop{
		width: .82rem;
		height: .82rem;
		background:rgba(255,255,255,.9);
		position: fixed;
		right: .23rem;
		bottom: 1.23rem;
		transition: .3s;
		opacity: 0;
		border-radius: 50%;
		line-height: .82rem;
	}
	.backTop span{
		font-size: .5rem;
		color: #aaa;
		margin-left: .15rem;
		
	}
	/* 遮罩层 */
	.shadow{
		width: 100vw;
		height: 100vh;
		background: rgba(0,0,0,.5);
		position: fixed;
		left: 0;
		top: 0;
		z-index: 1;
		display: none;
	}
	